```python import pandas as pd import altair as alt from vega_datasets import data locations_table = pd.read_csv(r"https://raw.githubusercontent.com/SwanseaU-TTW/csc337_coursework1/master/pleiades-locations-latest.csv") pd.set_option('display.max_columns', None) alt.data_transformers.disable_max_rows() locations_table.head() countries = alt.topo_feature(data.world_110m.url, 'countries') selector = alt.selection_single(empty='all', fields=['featureType']) colours_condition = alt.condition(selector,'featureType:N',alt.value('#666666')) # Used world cropping map of Europe from https://stackoverflow.com/questions/61135952/vega-lite-altair-how-to-center-or-crop-a-map-of-europe background = alt.Chart(countries).mark_geoshape( fill='#666666', stroke='white', ).project( type= 'mercator', scale= 350, # Magnify center= [20,50], # [lon, lat] clipExtent= [[0, 0], [400, 300]], # [[left, top], [right, bottom]] ).properties( title='Europe (Mercator)', ) scatter = alt.Chart(locations_table).mark_circle( fillOpacity=0.6 ).encode( latitude='reprLat:Q', longitude='reprLong:Q', color=colours_condition, tooltip=["featureType:N", 'timePeriods', 'timePeriodsRange'] ).project( type= 'mercator', scale= 350, # Magnify center= [20,50], # [lon, lat] 20,50 clipExtent= [[0, 0], [400, 300]], # [[left, top], [right, bottom]] ).properties( title='Europe (Mercator)', ).add_selection(selector) background + scatter ```